import React, {Component} from 'react';
import {
    Dimensions,
    Image,
    StyleSheet,
    TouchableOpacity,
    View,
    ScrollView
} from 'react-native';
import LoadingView           from '../views/LoadingView';
import Toast, {DURATION}     from 'react-native-easy-toast';
const {width} = Dimensions.get('window');


export default class WechatLoginScreeen extends Component {
    constructor(props) {
        super(props);
        this.state = {
            showProgress:false
        };
    }

    goLogin(){

    }

    render() {
        return (
            <View style={styles.container}>
                <ScrollView>

                    <View style={styles.loginViewStyle}>
                        <Image style={styles.logoStyle}
                            source={require('../../images/login/pic_logo.png')}/>
                    </View>

                    <TouchableOpacity activeOpacity={1} onPress={this.goLogin.bind(this)}>
                        <View style={styles.loginViewStyle}>
                            <Image style={styles.loginStyle}
                                source={require('../../images/login/wechatLogin.png')}/>
                        </View>
                    </TouchableOpacity>

                </ScrollView>

                <Toast ref="toast" position='center'/>
                { this.state.showProgress?(<LoadingView cancel={() => this.setState({showProgress:false})}/>):(null)}

            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor:'white'
    },
    logoStyle:{
        height:0.56*260,
        width:0.56*220
    },
    loginViewStyle:{
        marginTop:width/4,
        justifyContent:'center',
        alignItems:'center'
    },
    loginStyle:{
        width:0.56*520,
        height:0.56*100,
    }
});
